import './tap.css'
import {getData,getDelayedData} from 'api/getData'
import { URL,TAP_ITEM_CLASS,TAP_ITEM_ACTIVE } from './config'
//接口  https://www.imooc.com/api/mall-wepApp/destination/content/1

class Tap{
    constructor(el){
        this.itemEls=el.querySelectorAll(TAP_ITEM_CLASS)
    }
    setActiveItem(index){
        //取消上一次请求
        if(this.dataPromise && this.dataPromise.xhr){
            this.dataPromise.xhr.abort()
        }
        for(const itemEl of this.itemEls){
            itemEl.classList.remove(TAP_ITEM_ACTIVE)
        }
        this.itemEls[index].classList.add(TAP_ITEM_ACTIVE)
    }

    to(index){
        this.setActiveItem(index)
        this.dataPromise=getData(`${URL}/${this.itemEls[index].dataset.id }`)
        //xhr.abort()
        return this.dataPromise
    }
}
export default Tap